/**
 * Created by hexiaoyan on 2017/5/14.
 */
var webpack = require('webpack');
var HtmlwebpackPlugin = require('html-webpack-plugin');  //生成html文件的插件
var OpenBrowserPlugin = require('open-browser-webpack-plugin'); //新打开浏览器的插件
var uglifyJsPlugin = webpack.optimize.UglifyJsPlugin;  //压缩代码的插件
var CommonsChunkPlugin = require("webpack/lib/optimize/CommonsChunkPlugin");  //提取公共代码的插件
var path=require('path');
var ExtractTextPlugin=require('extract-text-webpack-plugin');
var extractCSS = new ExtractTextPlugin('stylesheets/[name].css');


module.exports = {
    entry: {
        bundle: path.resolve(__dirname, 'src/entry/main.js'),
        vendor:['jquery','vue','vue-router'],
    },
    output: {
        filename: '[name].js',
        path:path.resolve(__dirname, "./dist"),  //打包后的文件输出位置
    },

    resolve:{
        unsafeCache:true,  //启用，会主动缓存模块，但并不安全。传递 true 将缓存一切。也可以用正则表达式/src\/utilities/表示只缓存 src/utities
        modules:['node_modules', './node_modules'],  //告诉 webpack 解析模块时应该搜索的目录
        alias: {
            'vue$': 'vue/dist/vue.esm.js',
            'pages':path.resolve(__dirname, 'src/pages/'),
            'router':path.resolve(__dirname, 'src/router/'),
            'base':path.resolve(__dirname, 'src/base/')
        }
    },

    //http://www.css88.com/doc/webpack2/configuration/dev-server/
    devServer:{
        compress: true,   //经测试好像跟我预想的不一样，感觉这属性没什么卵用，可以写在这里


        port:"8080",

        host:"localhost",

        proxy:{
            "/wx": "http://localhost",  //将／api路径下的请求代理到 http://localhost:3000/api 比如请求到 /api/users 现在会被代理到请求 http://localhost:3000/api/users
            "/usa": { //如果你不想始终传递 /usa ，则需要重写路径：
                target: "http://localhost",
                pathRewrite: {"^/usa" : ""},   //  /usa/user 将变成 /user
                secure: false  //默认情况下，不接受运行在 HTTPS 上，且使用了无效证书的后端服务器。如果你想要接受，则设置这个选项
            }
        },

        //当使用HTML5 History API，任意的 404 响应可以提供为 index.html 页面。通过传入以下启用：
        historyApiFallback: true
    },

    module:{
        rules:[{
            test: /\.(png|jpg|gif|svg)$/,
            loader: 'file-loader',
            options: {
                name: '[name].[ext]?[hash]'
            }
        },{
            test: /\.vue$/,
            loader: 'vue-loader',
            options: {
                loaders: {
                }
                // other vue-loader options go here
            }
        },{
            test:/\.js$/,
            exclude:/node_modules/,
            loader:'babel-loader',
            query:{
                presets:['es2015']
            }
        },{
            test:/\.less$/,
            exclude:/node_modules/,
            use: extractCSS.extract({
                fallback: "style-loader",
                use:['css-loader',  {
                    loader: 'postcss-loader',
                    options: {
                        plugins: function() {
                            return [
                                require('postcss-import'),
                                require('autoprefixer')
                            ];
                        }
                    }
                },'less-loader']
                }
                )
        }]
    },
    plugins: [
        new HtmlwebpackPlugin({
            title: 'Webpack-demos',
            filename: 'index.html',
            template:'./src/entry/index.html',
            chunks:['manifest','vendor','bundle'],  //这里如果写出了要调用哪些chunk那么就要把列入的chunk全部列举出来，包括commonchunkplungin里的manifest
            chunksSortMode:function(val1,val2){   //排序
                var chunks=['manifest','vendor','bundle'];
                return chunks.indexOf(val1.names[0])-chunks.indexOf(val2.names[0]);
            }

        }),
        new OpenBrowserPlugin({
            url: 'http://localhost:8080'
        }),
        new webpack.ProvidePlugin({   //这样就不用每次require（'jquery'）去获得jquery变量
            $: "jquery",
            jQuery: "jquery",
            "window.jQuery": "jquery"
        }),
        new webpack.optimize.CommonsChunkPlugin({
            names: ['vendor','manifest'],  //之所以弄两个名字是为了防止该文件未改变却因为其它文件改变而被重新编译
        }),
        //用来接收传入npm时传入的参数
        //http://www.css88.com/doc/webpack2/plugins/extract-text-webpack-plugin/
        extractCSS  //它会将所有的 入口chunk (entry chunks) 中的 require("style.css")的css打包到一个文件中去
    ]

};
if (process.env.NODE_ENV === 'production') {
    module.exports.devtool = '#source-map'
    // http://vue-loader.vuejs.org/en/workflow/production.html
    module.exports.plugins = (module.exports.plugins || []).concat([
        new webpack.DefinePlugin({
            'process.env': {
                NODE_ENV: '"production"'
            }
        }),
        new webpack.optimize.UglifyJsPlugin({
            sourceMap: true,
            compress: {
                warnings: false
            }
        }),
        new webpack.LoaderOptionsPlugin({
            minimize: true
        })
    ])
}